﻿
@{
    ViewBag.Title = "Добавить прокачку для "+ViewBag.Hero.Name;
    ViewBag.Meta_description = "Добавить свою прокачку для " + ViewBag.Hero.Name;
    ViewBag.Meta_keywords = ViewBag.Hero.Name + ", прокачка, добавить, DotaHelp, dota ";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<style type="text/css">
    #Items img
    {
        width:32px;
        height:32px;
        cursor:pointer;
    }
    
    #selectedItems img
    {
        display:inline;
        cursor:crosshair;
        width:64px;
        height:64px;
    }
</style>

<script type="text/javascript">
    function ChangeVisible() {
        // ignore invoker 
        if ($("#heroId").val() === 81) return;

        var level = $("#selectedItems img").length + 1;
        var skills = $("#Items .Item").map(function () { return $(this); }).toArray();
        for (var i = 0; i < skills.length; i++) {
            var count = $("#selectedItems img").filter(function () { return $(this).attr("skillId") === skills[i].attr("skillId"); }).length;

            var visible = false;
            if (i < 3) {
                visible = count == 3 && level >= 7
                || count == 2 && level >= 5
                || count == 1 && level >= 3
                || count == 0 ;
            } else if (i == 3) {
                visible = count == 2 && level > 15
                    || count == 1 && level > 10
                    || count == 0 && level > 5
            } else {
                visible = count < 10;
            }
            if (visible) skills[i].show(); else skills[i].hide();
        }
    }

    $(function () {
        $(".Item").bind("click", function () {            
            if ($("#selectedItems img").length < 25) {
                var img = $(this).clone(false);
                $(img).bind("click", function () {
                    $(this).remove();
                    ChangeVisible();
                }).appendTo("#selectedItems");
                ChangeVisible();
            }
        });
        ChangeVisible();
    });

    function Save() {
        if ($("#Author").val() == "") {
            alert("Назовись!");
            $("#Author").focus();
            return false;
        }

        if ($("#Password").val() == "") {
            alert("Укажи пароль.");
            $("#Password").focus();
            return false;
        }

        if ($("#Comment").val() == "") {
            alert("А как пользоваться твоей прокачкой?");
            $("#Comment").focus();
            return false;
        }

        var selItems = $("#selectedItems img");
        if (selItems.length == 0) {
            alert("Пустую прокачку сохранять нельзя");
            return false;
        }

        $("#skills").val(selItems.map(function () { return $(this).attr("skillId") }).toArray().join(","));

        return true;
    } 
</script>

<h2> @Html.LinkOnHero((Hero)ViewBag.Hero) Добавить прокачку для @ViewBag.Hero.Name </h2>


@using (var form = Html.BeginForm())
{
    @Html.Hidden("heroId", (int) ViewBag.Hero.Id);
    @Html.Hidden("skills");
    
    <div>
       Автор: @Html.TextBox("Author", (string)ViewBag.UserName, new { @class = "required" })
       Пароль (используется для получения подарков): @Html.Password("Password")
       <input type="Submit" value="Сохранить" style="width:150px" onclick="return Save();" />        
    </div>

    <div id="selectedItems" style="border:solid 1px darkgray;margin:5px 0px; height:160px;padding-top:6px;text-align:left;padding-left:5px; overflow-y:auto;">
 
    </div>

    <div style="margin-top:15px" id="Items">
        <table>
            <tr>
        @foreach (Skill skill in ViewBag.Skills)
        {
            <td style="width:34px;height:34px;padding:1px;border:1px solid black">
                @Html.Image(skill.ImageId, "Skills", skill.Id, new { @class = "Item", skillId = skill.Id })
            </td>
        }
                </tr>
            </table>
    </div>


    <h3>Применение прокачки:</h3>
    @Html.TextArea("Comment", new { rows = 10, cols = 80, style = "border:solid 1px black" })
}